<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1,minimum-scale-1,user-scalable=no" >
	<title>注册页面</title>
	{load href='__PUBLIC__/static/js/jquery-3.1.1.min.js'}
	<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
	<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</head>

<body>

<div class="loginBox center container">
	<form action="{:url('login/register')}" method="POST">
		<div class="col-lg-10 col-lg-offset-1">
			<h4>欢迎注册</h4>
		</div>
		<div class="form-group col-lg-10 col-lg-offset-1">
			<label for="">账号</label>
			<input type="text" name="username" class="form-control" placeholder="请输入账号">
		</div>
		<div class="form-group col-lg-10 col-lg-offset-1">
			<label for="">密码</label>
			<input type="password" name="password" class="form-control" placeholder="请输入密码">
		</div>
		<div class="form-group col-lg-10 col-lg-offset-1">
			<label for="">请再次输入密码</label>
			<input type="password" name="repassword" class="form-control" placeholder="请输入密码">
		</div>
		<div class="form-group col-lg-10 col-lg-offset-1">
			<label for="">验证码</label>
			<div class="input-group">
				<input type="text" name="captcha" class="form-control" placeholder="请输入验证码">
				<span class="input-group-addon" style="padding:0;">
					<img id="captcha-img" alt="验证码" class="img-rounded" src="{:captcha_src()}" onclick="refreshVerify()" />
				</span>	
			</div>
		</div>
		<div class="col-lg-10 col-lg-offset-1">
			<input class="btn btn-primary btn-block" type="submit" value="注册">
		</div>
    </form>
</div>

<script type="text/javascript">
	function refreshVerify() {
		var ts = Date.parse(new Date())/1000;
		var img = document.getElementById('captcha-img');
		img.src = "http://test.com/playground_tp5/public/captcha.html?id="+ts;
	}
</script>

<style>
	body{
		background: url(/playground_tp5/public/static/picture/bg1.jpg) no-repeat center fixed;
		background-size: cover;
	}
	.loginBox{
		width: 400px;
		padding: 20px 0;
		background-color: #E8E8E8;
		border-radius: 10px;
	}
	.center {
		position: fixed;
		top: 50%;
		left: 50%;
		-webkit-transform: translateX(-50%) translateY(-50%);
		-moz-transform: translateX(-50%) translateY(-50%);
		-ms-transform: translateX(-50%) translateY(-50%);
		transform: translateX(-50%) translateY(-50%);
	}
</style>